<template>
  <div class="jingxuan">
    <h6>
      <img
        src="https://img.alicdn.com/imgextra/i4/3390270589/O1CN01voZOKR1GDnzvT9zeG_!!3390270589.jpg"
      />精选榜单<span class="ci">更多&nbsp;&nbsp;></span>
    </h6>
    <ul class="bangdan">
      <li style="margin-left: 0">
        <h4>网络电影榜</h4>
        <div class="bangdan1">
        
          <img src="../../../assets/img/yl-img/dy/dy_03.jpg" />
         <p>亚洲舞王&nbsp;<b>7.2</b></p>
          <span>2021·喜剧·中国</span>
          <span>舞王"赵四"大秀魔鬼舞步</span>
        </div>
        <div class="bangdan1">
          <img src="../../../assets/img/yl-img/dy/dy_09.jpg" />
         <p>新逃学威龙&nbsp;<b>8.0</b></p>
          <span>2021·喜剧·中国</span>
          <span>特警卧底学校破获大案</span>
        </div>
        <div class="bangdan1">
          <img src="../../../assets/img/yl-img/dy/dy_13.jpg" />
         <p>苍狼之特战突击&nbsp;<b>7.9</b></p>
          <span>2021·喜剧·中国</span>
          <span>晓勇骑兵为和平抗战到底</span>
        </div>
        <p class="p1">查看更多影片</p>
      </li>

      <li style="margin-left: 0">
        <h4>高分榜</h4>
        <div class="bangdan1">
        
          <img src="https://img.alicdn.com/imgextra/i3/3390270589/O1CN01TVl5Dg1GDo04niJGa_!!3390270589.jpg" />
         <p>肖申克的救赎&nbsp;<b>9.8</b></p>
          <span>1994·喜剧·美国</span>
          <span>影史经典探寻自由真谛</span>
        </div>
        <div class="bangdan1">
          <img src="https://img.alicdn.com/imgextra/i2/3390270589/O1CN01tH8t7B1GDo01oYFaf_!!3390270589.jpg" />
         <p>霸王别姬&nbsp;<b>9.7</b></p>
          <span>1993·剧情·中国</span>
          <span>张国荣疯魔戏曲人生</span>
        </div>
        <div class="bangdan1">
          <img src="https://img.alicdn.com/imgextra/i2/3390270589/O1CN01IfoaET1GDnzxSkMIw_!!3390270589.jpg" />
         <p>阿甘正传&nbsp;<b>7.9</b></p>
          <span>1994·剧情·美国</span>
          <span>一个人的励志美国史</span>
        </div>
        <p class="p1">查看更多影片</p>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "Jingxuan",
  props: [],
  data() {
    return {
      handpicks: [],
      kv: {
        网络电影榜: "jingxuan",
      },
    };
  },
};
</script>

<style scoped>
/* 精选榜单 */
.jingxuan {
  margin-left: 0.15rem;
}

h6 {
  font-size: 0.16rem;
  padding-top: 0.3rem;
  width: 100%;
  height: 0.18rem;
  color: black;
  margin-bottom: 0.12rem;
  /* background-color: royalblue; */
}
.ci {
  float: right;
  margin-right: 0.15rem;
  font-size: 0.11rem;
  color: #babbbf;
  margin-top: 0.06rem;
}
.bangdan {
  width: 3.98rem;
  /* background-color: yellow; */
  display: flex;
  white-space: nowrap;
  overflow: auto;
}
.bangdan::-webkit-scrollbar {
  display: none;
}
.bangdan li img {
  width: 0.65rem;
  height: 0.87rem;
  float: left;
  margin-right: 0.15rem;
}
.bangdan li {
  width: 3.04rem;
  height: 3.76rem;
  background-color: #f4f4f4;
  margin-right: 0.1rem;
}
.bangdan li h4 {
  margin-left: 0.13rem;
}
.bangdan li span {
  display: block;
  color: #b1b1b1;
  font-size: 0.11rem;
  line-height: 0.18rem;
}
.bangdan1 {
  width: 2.83rem;
  height: 0.87rem;
  margin-left: 0.13rem;
}
.bangdan1 b {
  color: #be9325;
}
.bangdan1 p {
  margin-top: 0.07rem;
  margin-bottom: 0.1rem;
  font-size: 0.14rem;
}
.p1 {
  font-size: 0.11rem;
  color: #8d8b8c;
  width: 2.83rem;
  text-align: center;
  height: 0.4rem;
  line-height: 0.4rem;
  background-color: #f7f5f6;
  margin-top: 0.2rem;
}
</style>